import { toLogin } from '@/api/index';
<template>
    <div>
        <el-row type="flex" justify="center">
            <el-col :span="7.5" style="color: #a3cc7f; font-size: large;font-family: 'Helvetica Neue';">热门排行</el-col>
        </el-row>
        <el-row type="flex">
            <el-col>
                <el-table :data="tableData" style="width: 100%" :row-class-name="tableRowClassName" rowKey="totanyId">
                    <el-table-column header-align="center" align="center" witdth="33%" label="热度"
                        type="index"></el-table-column>
                    <el-table-column header-align="center" align="center" witdth="33%" label="花卉"
                        prop="totanyName"></el-table-column>
                    <el-table-column header-align="center" align="center" witdth="33%" label="操作">
                        <template slot-scope="scope">
                            <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </el-col>
        </el-row>
    </div>
</template>

<script>
import router from '@/router';



const options = {
    props: ["tableData"],
    methods: {
        tableRowClassName({ rowIndex }) {
            if (rowIndex % 2 === 1) {
                return 'success-row';
            }
            return 'pink-row'
        },
        handleClick(row) {
            console.log(row);
            this.$store.commit("setPlant", row);
            localStorage.setItem("plant", JSON.stringify(row));
            router.push("/front/display");
        }
    }
}


export default options;
</script>
<style>
.el-table .success-row {
    background: #ecfbe5;
    font-size: smaller;
}

.el-table .pink-row {
    background: #ecfcfb;
    font-size: smaller;
}
</style>